<script setup lang="ts">
//import {store} from "../hooks/useHome"
import {} from "../hooks/useAccount"
</script>

<template>
    <form action="/api" method="post" class="loginCssForm">
        <div class="username">
            <label>账号</label>
            <input type="text" name="" placeholder="" /><br>
        </div>
        <div class="password">
            <label>密码</label>
            <input type="text" name="" placeholder="" /><br>
        </div>
        
    </form> 
</template>

<style lang="less" scoped>
.loginCssForm{
    display: flex;
    align-items: center;
    justify-content: center;
    .username{
        label{
            position: relative;
            left: 33px;
            transition: all 0.5s;
        }
        input{
            position: relative;
            outline: none;/*取消默认样式 */
            border: none;
            border-bottom: 1px solid #f00;
            background-color: transparent;/*透明设置*/
        }
        input:active ~ label{
            transform: translateY(-10px);
            color: #f00;
        }
    }
    .password{
        label{}
        input{}
    }
}
</style>